<template>
	<view class="" style="min-height: 100vh;"
		:style="{background:'url('+Imgbase+'/new_goodmy_bgc.png)','background-size':'100%',}">
		<view class="zinde">
			<view class="" style="padding: 105rpx 20rpx 0;position: relative;z-index: 99;" @click="back">
				<image class="w-80 h-80 margin-top-10" :src="Imgbase + '/new_goodlx_img1.png'" mode="aspectFit">
				</image>
			</view>
		</view>

		<view class="w100 text-center Afont font-38 padding-25" style="color: #A15B25;">
			我的收藏
		</view>

		<view class="padding-left-25 padding-bottom-100" style="overflow: hidden;">
			<view class="list_item w-210 h-350 radius-14 margin-bottom-35" v-for="(item,index) in list" :key="index"
				:style="{background:'url('+Imgbase+'/new_goodbp_img8.png)','background-size':'100% 100%',}">

				<view class="w-210 h-200 text-center imga radius-15"
					@click="godetail(item.shop_goods_id,item.is_special)">
					<image class="w100 h100 radius-15" :src="item.adimage" mode="aspectFill"></image>
				</view>
				<view class="Afont item_text w100 two-line font-24 h-65"
					@click="godetail(item.shop_goods_id,item.is_special)">
					{{item.name}}
				</view>
				<view class="flex-between h-40">
					<view class="padding-left-8" @click="godetail(item.shop_goods_id,item.is_special)">
						<view class="item_price font-22  Afont" v-if="item.price !== '0.00'">
							<!-- <text v-if="spaceid > 0">红豆:</text> -->
							<text>￥</text>
							<text class="font-30">{{item.price}}</text>
						</view>
						<view class="item_price font-28 Afont" v-if="item.score > 0">
							积分:{{item.score}}
						</view>
					</view>
					<view class="padding-top-20 padding-right-10"
						@click="islike(item.shop_goods_id,item.is_special,index)">
						<image :src=" Imgbase+'/new_goodmall_img2.png'" v-if="item.is_collect == 0" mode="aspectFit"
							class="w-35 h-30">
						</image>
						<image :src=" Imgbase+'/new_goodmall_img3.png'" v-else mode="aspectFit" class="w-35 h-30">
						</image>
					</view>
				</view>
				<view class="Afont font-20 padding-left-8 padding-top-5"
					@click="godetail(item.shop_goods_id,item.is_special)">
					剩余库存:{{item.stock}}
				</view>

			</view>
		</view>

		<view class="h-100">

		</view>



	</view>
</template>

<script>
	export default {
		data() {
			return {
				Imgbase: getApp().globalData.Imgbase,
				page: 1,
				list: []
			}
		},
		onLoad(e) {
			this.collectList()
		},
		onShow() {},
		methods: {
			back() {
				uni.navigateBack()
			},
			// 收藏
			async islike(e, id, index) {
				let _this = this
				let item = await this.$api.post('shop/goodCollect', {
					token: uni.getStorageSync('token'),
					id: e,
					special: id
				})
				if (item.data.state == 1) {
					this.list[index].is_collect = 1
				} else {
					this.list[index].is_collect = 0
				}
				this.$forceUpdate()
				uni.showToast({
					icon: 'none',
					title: item.data.tip
				});
			},
			godetail(e, id) {
				if (id == 0) {
					uni.navigateTo({
						url: '/pages/index/detail?id=' + e
					})
				} else {
					uni.navigateTo({
						url: '/pagesA/advanced/detail?id=' + e
					})
				}

			},
			async collectList() {
				let _this = this
				let item = await this.$api.post('shop/collectList', {
					token: uni.getStorageSync('token'),
					page: _this.page,
					limit: 20
				})
				_this.list = _this.list.concat(item.data.list)
				// this.list = item.data.list
			},
		},
		onReachBottom() {
			this.page++;
			this.collectList()
		},
	}
</script>

<style lang="less" scoped>
	.list_item {
		float: left;
		margin-right: 22rpx;

		.imga {
			border: 4rpx solid #8A5E51;
		}

		.item_hot {
			position: absolute;
			z-index: 100;
			top: -30rpx;
			right: -28rpx;
		}

		.item_bgc {
			position: absolute;
			z-index: 0;
			top: 0;
			left: 0;
		}


		.item_num {
			position: absolute;
			z-index: 10;
			left: 128rpx;
			font-size: 22rpx;
			margin-top: 16rpx;
		}

		.item_text {
			padding: 0 8rpx;
		}

		.item_price {
			color: #E60403;
		}
	}

	.list_item:nth-child(3n) {
		margin-right: 0rpx;
	}
</style>